$(document).ready(function () {

    //$('.container').length
//call and apply
    $('body').on('click', 'li', function () {

        if ($(this).hasClass('taskDone')) {
            $(this).remove();
        } else {
            $(this).addClass('taskDone');
        }

    });
//    $('li').click(function (){
//        $(this).addClass('taskDone');
//    });

    function addTask() {
        //1. get the value entered in the text input
        var taskEntered = $('#taskInput').val();
        $('#taskInput').val('');
        //2. create a li element and append value entered in to li and finally append to ul
        $('<li>').text(taskEntered).addClass('task').appendTo('#taskList');
        //addClass
        //removeClass
        //toggleClass

        // $('li')
        //


    }


    $('#btnAddTask').click(addTask);


    $('#taskInput').keydown(function(event){

        if(event.keyCode === 13){
            addTask();
        }

    });

});
